<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>To Do List ByJQuery</title>
<!--    <link rel="stylesheet" href="bootstrap.min.css">-->
    <link rel="stylesheet" href="myTodolist.css">
    <script src="jquery-3.1.0.js"></script>
    <script src="myTodolist.js"></script>
</head>

<body>
        <div id="container">
            <div id="header">
                <div id="title">myToDoList</div>

            </div>
            <div id="taskWrapper">
                <div class="task">
                    <div class="type" id="t1">
                        <span >紧急事项（first）</span>
                        <span class="add"><button>+</button></span>
                    </div>
                    <form class="todoForm">
                        <label>待办项：</label>
                        <input type="text" id="todoThing" class="form1"/>
                        <label>时间段：</label>
                        <input type="text" id="todoTime" class="form1"/>
                        </br>
                        <label>负责人：</label>
                        <input type="text" id="todoLeader" class="form1"/>
                        <button id="confirm">确认</button>
                        <button id="cancel">取消</button>
                    </form>
                    <div class="item">
                        <!--<p id="todoCount"></p>-->
                        <ul id="todoItem"></ul>
                    </div>
                </div>
                <div class="task">
                    <div class="type" id="t2">
                        <span>已完成事项</span>
                    </div>
                    <div class="item">
                        <!--  <p id="todoCount"></p>-->
                        <ul id="finishedItem"></ul>
                    </div>
                </div>
                <div class="task">
                    <div class="type" id="t3">
                        <span>推迟事项（second）</span>
                    </div>
                    <div class="item">
                        <!--  <p id="todoCount"></p>-->
                        <ul id="delayItem"></ul>
                    </div>
                </div>
                <div class="task">
                    <div class="type" id="t4">
                        <span>取消事项</span>
                    </div>
                    <div class="item">
                        <!--  <p id="todoCount"></p>-->
                        <ul id="cancelItem"></ul>
                    </div>
                </div>
            </div>

        </div>


</body>
</html>